<template>
	<view class="search">
		<view style="flex: 1;" class="search_box">
			<icon type="search" size="15"></icon>
			<input type="text" confirm-type="search" @confirm="search" placeholder="请输入商品" auto-focus placeholder-style="font-size: 28upx">
		</view>
		<text @tap="search">搜索</text>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				value: "",
				style: {

				}
			};
		},
		methods: {
			search(){
				this.$common.navigateTo({},"/pages/searchResult/index")
			}
		}
	}
</script>

<style lang="scss">
	page{
		min-height: 100%;
		background-color: #fff;
	}
	.search{
		width: 686upx;
		margin: 0 auto;
		margin-top: 20upx;
		display: flex;
		align-items: center;

		&_box{
			display: flex;
			align-items: center;
			height: 64upx;
			background-color: rgb(242, 242, 242);
			box-sizing: border-box;
			padding: 0 20upx;
			border-radius: 100upx;
			>input{
				flex: 1;
				box-sizing: border-box;
				padding-left: 20upx;
			}
		}
		>text{
			font-size: 28upx;
			color: #303133;
			width: 80upx;
			overflow: hidden;
			transition: all .3s;
			white-space: nowrap;
			text-align: center;
			margin-left: 10upx;
		}
	}
</style>
